$(function () {
    $("#icon").click(function () {
        tan('.mark', '.mark_ul')
    })
    $('.mark').click(function () {
        hide('.mark', '.mark_ul')
    })

    //底部显示效果
    function tan(a, b) {
        console.log(a);
        $(a).css({
            display: "block"
        })
        $(b).slideDown(100)
    }
    //底部隐藏效果
    function hide(a, b) {
        $(b).slideUp(100)
        $(a).css({
            display: "none"
        })
    }

    // 上传头像
    $('#xdaTanFileImg').on('change', function (e) {
        //添加页面
        var files = e.target.files;
        var reader = new FileReader();
        reader.readAsDataURL(files[0], "UTF-8");
        reader.onload = function (evt) {
            var fileString = evt.target.result;
            var date = {
                "headImageUrl": fileString
            };
            $('#touxiang').attr('src', fileString);
            console.log(fileString)
        }
        //对开发人员屏蔽，所以直接 必须调用这个文件的DOM对象的files属性，返回一个数组
        console.log(this);
        // 判断一手是否有文件
        // if (!files.length) return;
        // 上传文件 创建FormData
        let formData = new FormData()
        // upFile就是后台接收的key
        formData.append('headImageUrl', files[0])
        formData.append('id', id)
        console.log(formData);
        // 将formdata发送到后台即可
        // 将formdata发送到后台即可
        // 我用的 axios.post('url', formData)
        $.ajax({
            url: header_Img_Api,
            type: 'POST',
            cache: false,
            data: formData,
            processData: false,
            contentType: false
        }).done(function (res) {
            console.log(res);
        }).fail(function (res) { });
    })



    //修改昵称
    $("#nickname").click(function () {
        $(".nick").css("display", "block")
        let a = $(".old_nickname").text()
        $('#new_nickname').val(a)
        $(".nick").animate({
            left: 0,
        }, 100)
    })
    //删除
    $(".icon-shanchu").click(() => {
        $('#new_nickname').val('')
    })
    //确定
    console.log(id);
    $('.sure').click(function () {
        let str = /\S{4,20}/
        let a = ($('#new_nickname').val())
        if (str.test(a)) {
            console.log(a);
            $.post(update_User_Api, {nickname:a, id}, function (data) {
                console.log(data);
                $(".old_nickname").text($('#new_nickname').val())
                slip('.nick')
            })
        } else {
            let tip = '昵称不合法，昵称必须是4到20位字符'
            tipp(tip, '.nick')
            $(".tips").css("left", "1rem")
        }
    })
    // 提示框
    function tipp(tiptxt, sel) {
        clearInterval(clear)
        var tips = document.querySelector('.tips')
        if (tips) {
            tips.remove()
        }
        var tip = document.createElement('div')
        var nick = document.querySelector(sel)
        nick.appendChild(tip)
        tip.innerHTML = tiptxt
        tip.classList.add("tips")
        $(".tips").slideToggle(50)
        var clear = setTimeout(() => {
            tip.remove()
        }, 2000);
    }
    //返回
    $(".icon-fan_hui").click(() => {
        slip('.nick')
    })
    //动画
    function slip(sel) {
        $(sel).animate({
            left: 100 + '%',
        }, 200, function () {
            $("sel").css("display", "none")
        })
    }



    //出生日期
    $('#birthday').click(function () {
        $(".date").css("display", "block").animate({
            left: 0,
        }, 100)
    })
    //返回
    $('.date_fanhui').click(function () {
        slip('.date')
    })
    //确定
    let bir = true
    $(".date_sure").click(function () {
        let birthday = $('.year').val() + '-' + $('.month').val() + '-' + $('.day').val()
        console.log(birthday);
        $.post(update_User_Api, { birthday, id}, function (res) {
            slip('.date')
            bir = false;
            $('#birthday span').text(birthday)//设置页面的生日
        })
    })




    // 修改性别
    $('#sex').click(function () {
        tan('.changesex', '.changesex_ul')
    })
    $('.changesex').click(function () {
        hide('.changesex', '.changesex_ul')
    })
    $('.male').click(function () {
        let sex = $(".male").text()
        $.post(update_User_Api, {sex, id}, function (res) {
            $('.select_sex').text($(".male").text())
        })
    })
    $('.Female').click(function () {
        let sex = $(".Female").text()
        $.post(update_User_Api, {sex, id}, function (res) {
            $('.select_sex').text($(".Female").text())
        })
    })


    // 实名认证
    $('#attestation').click(function () {
        $(".Verified").css("display", "block")
        $(".Verified").animate({
            left: 0,
        }, 100)
    })
    //返回
    $('.Verified_fanhui').click(function () {
        $(".Verified").animate({
            left: 100 + '%',
        }, 100)
    })
    //检测实名认证
    let na = /^[\u2E80-\u9FFF]+$/
    let ca = /(^\d{15}$|^\d{18}$)|^\d{17}X$/
    $(".Verified_sure").click(function () {
        let nam = $('#username').val();
        if (nam == '') {
            let tip = '请输入姓名'
            tipp(tip, '.Verified')
            $(".tips").css({
                left: "2.8rem",
                top: "5rem"
            })
        } else {
            //判断身份证
            if (ca.test($("#card").val())) {
                let card = $("#card").val()
                $.post(update_User_Api, {name:nam,card, id}, function (res) {
                    console.log(res);
                    $('#attestation span').text($("#username").val())
                    // slip('.Verified')
                    // $.post(getUser_Api, {id}, function (data) {
                    //     console.log(data);
                    // })
                })
            } else {
                let tip = '请填写真实的用户信息'
                tipp(tip, '.Verified')
                $(".tips").css({
                    left: "2rem",
                    top: "5rem"
                })
            }
        }
    })


    // 个人账户更新
    function upbirth() {
        $.post(getUser_Api, {id}, function (data) {
            console.log(data);
            // 头像
            $('#icon img').attr('src',`${data.headimageurl}`)
            // 昵称
            if(data.phonenum){
                $('#nickname span').text(data.nickname)
            }else{
                $('#nickname span').text(data.phonenum)
            }
            // 出生日期
            if(data.birthday){
                $('#birthday span').text(data.birthday)
            }else{
            $('#birthday span').text('请选择出生日期')
            }
            // 性别
            if(data.sex){
                $('.select_sex').text(data.sex)
            }else{
            $('.select_sex').text('请选择性别')
            }
            // 实名认证
            if(data.name){
                 $('#attestation span').text(data.name)
            }else{
                $('#attestation span').text('实名认证') 
            }
           
        })
    }
    upbirth()
})